@tailwind base;
@tailwind components;
@tailwind utilities;

:root {
  --color-primary-400: #6366f1;
  --color-primary-500: #4f46e5;
  --color-primary-900: #312e81;
  
  --color-secondary-400: #f472b6;
  --color-secondary-500: #ec4899;
  --color-secondary-900: #831843;
  
  --color-tertiary-400: #34d399;
  --color-tertiary-500: #10b981;
  --color-tertiary-900: #064e3b;
  
  --color-quaternary-400: #fb923c;
  --color-quaternary-500: #f97316;
  --color-quaternary-900: #7c2d12;
}

/* 添加自定义动画 */
@keyframes float-slow {
  0%, 100% { transform: translateY(0) rotate(0); }
  50% { transform: translateY(-20px) rotate(5deg); }
}

@keyframes float-medium {
  0%, 100% { transform: translateY(0) rotate(0); }
  50% { transform: translateY(-15px) rotate(-5deg); }
}

@keyframes float-fast {
  0%, 100% { transform: translateY(0) rotate(0); }
  50% { transform: translateY(-10px) rotate(10deg); }
}

.animate-float-slow {
  animation: float-slow 8s ease-in-out infinite;
}

.animate-float-medium {
  animation: float-medium 6s ease-in-out infinite;
}

.animate-float-fast {
  animation: float-fast 4s ease-in-out infinite;
}

/* 移除主题相关CSS变量和类 */
:root {
  /* 默认浅色主题变量 */
  --bg-color: #f0f2f5;
  --component-bg-color: #ffffff;
  --text-color: rgba(0, 0, 0, 0.85);
  --text-color-secondary: rgba(0, 0, 0, 0.45);
  --border-color: #f0f0f0;
  --primary-color: #1890ff;
}

.dark {
  /* 深色主题变量 */
  --bg-color: #1f1f1f;
  --component-bg-color: #141414;
  --text-color: rgba(255, 255, 255, 0.85);
  --text-color-secondary: rgba(255, 255, 255, 0.45);
  --border-color: #303030;
}

/* 应用主题变量 */
body {
  background-color: var(--bg-color);
  color: var(--text-color);
}